import 'package:flutter/material.dart';
import 'friend.dart';
import 'mine.dart';
import 'group.dart';
import 'message.dart';

void main() => runApp(MaterialApp(
      title: "Flutter Chat",
      theme: ThemeData(
        primaryColor: Colors.blue[600],
      ),
      home: MyApp(),
      debugShowCheckedModeBanner: false,
      debugShowMaterialGrid: false,
    ));

class MyApp extends StatefulWidget {
  MyAppState createState() => MyAppState();
}

class MyAppState extends State {
  //底部导航按钮索引
  int iconButtonIndex = 0;

  Widget body = Message();

  String appBarTitle() {
    if (iconButtonIndex == 0) {
      body = Message();
      return "消息";
    }
    if (iconButtonIndex == 1) {
      body = Friend();
      return "好友";
    }
    if (iconButtonIndex == 2) {
      body = Group();
      return "群组";
    }
    if (iconButtonIndex == 3) {
      body = Mine();
      return "我的";
    }
    return "消息";
  }

  //底部图标的颜色
  Color iconColor(int iconindex) {
    if (iconindex == iconButtonIndex) {
      return Colors.blue[600];
    } else {
      return Colors.grey;
    }
  }

  //底部图标的大小
  double iconSize(int iconindex) {
    if (iconindex == iconButtonIndex) {
      return 32.0;
    } else {
      return 28.0;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[100],
      appBar: AppBar(
        title: Text(
          appBarTitle(),
          style: TextStyle(color: Colors.white),
        ),
        actions: <Widget>[
          IconButton(
            icon: Icon(
              Icons.search,
              size: 30.0,
              color: Colors.white,
            ),
            onPressed: () {},
          ),
          IconButton(
            icon: Icon(
              Icons.add,
              size: 30.0,
              color: Colors.white,
            ),
            onPressed: () {
              showMenu(
                  context: context,
                  position: RelativeRect.fromLTRB(
                      MediaQuery.of(context).size.width, 84, 0, 0),
                  items: <PopupMenuEntry<int>>[
                    PopupMenuItem(
                      value: 0,
                      child: Row(
                        children: <Widget>[
                          Padding(
                            padding: EdgeInsets.fromLTRB(0.0, 0.0, 9.0, 0.0),
                            child: Icon(Icons.add),
                          ),
                          Text("添加好友")
                        ],
                      ),
                    ),
                    PopupMenuDivider(height: 1.0),
                    PopupMenuItem(
                      value: 1,
                      child: Row(
                        children: <Widget>[
                          Padding(
                            padding: EdgeInsets.fromLTRB(0.0, 0.0, 8.0, 0.0),
                            child: Icon(Icons.add_circle_outline),
                          ),
                          Text("添加群组")
                        ],
                      ),
                    ),
                    PopupMenuDivider(height: 1.0),
                    PopupMenuItem(
                      value: 2,
                      child: Row(
                        children: <Widget>[
                          Padding(
                            padding: EdgeInsets.fromLTRB(0.0, 0.0, 8.0, 0.0),
                            child: Icon(Icons.create),
                          ),
                          Text("创建群组")
                        ],
                      ),
                    ),
                  ]);
            },
          ),
        ],
      ),
      body: body,
      bottomNavigationBar: BottomAppBar(
        //因为不想用文字所以用 BottomAppBar
        color: Colors.white,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            Stack(
              fit: StackFit.loose,
              alignment: Alignment.center,
              children: <Widget>[
                IconButton(
                  icon: Icon(
                    Icons.chat,
                    size: iconSize(0),
                    color: iconColor(0),
                  ),
                  onPressed: () => setState(() => iconButtonIndex = 0),
                ),
                Positioned(
                    top: 1.0,
                    right: 1.0,
                    child: Container(
                      alignment: Alignment.center,
                      padding: EdgeInsets.all(2.0),
                      decoration: BoxDecoration(
                          color: Colors.red, shape: BoxShape.circle),
                      child: Text(
                        "12",
                        style: TextStyle(color: Colors.white, fontSize: 14.0),
                      ),
                    ))
              ],
            ),
            IconButton(
              icon: Icon(
                Icons.perm_contact_calendar,
                size: iconSize(1),
                color: iconColor(1),
              ),
              onPressed: () => setState(() => iconButtonIndex = 1),
            ),
            IconButton(
              icon: Icon(
                Icons.group,
                size: iconSize(2),
                color: iconColor(2),
              ),
              onPressed: () => setState(() => iconButtonIndex = 2),
            ),
            IconButton(
              icon: Icon(
                Icons.account_circle,
                size: iconSize(3),
                color: iconColor(3),
              ),
              onPressed: () => setState(() => iconButtonIndex = 3),
            )
          ],
        ),
      ),
    );
  }
}
